<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue的事件 </title>

    <script src="https://unpkg.com/vue@3.4.32/dist/vue.global.js"></script>
    <!-- 网络下载 vue.js 文件 -->
</head>
<body>
<!--
    01 引入依赖
    02 写一个页面
    03 创建vue对象  和 页面绑定
        01 引入 vue 中的函数  createApp, ref
        02 创建vue对象
          let app = createApp({
               setup(){
                  初始化数据
                  return {
                      数据、函数
                  }
               }
            })
        03  绑定页面
        app.mount("#app")

    {{}}  差值表达式
        可以使用 vue对象中 定义的数据
-->

<div id="app">
    <button @click="hello">按钮1</button>
    <button @click="show('123456')">按钮2</button>
    <button @click="show2(msg)">按钮3</button>
</div>

<script>
    const { createApp, ref } = Vue;
    const app = createApp({
        setup(){

            let msg = ref("中彩票了....")

            let hello =()=>{
                alert("点我干嘛")
            }

            function show(num){
                alert("点我干嘛"+num)
            }

            function show2(m){
                alert(m);
            }

            return {
                msg,hello,
                show,show2
            }
        }
    });
    app.mount('#app');

</script>

</body>
</html>